<template>
	<view class="bg" :style="{'height':this.windowHeight*2+'rpx'}">
		<view class="content">
			<text class="title">电梯维保</text>
			<view class="input">
				<input class="username" type="text" placeholder="请输入账号" v-model="username" />
				<input class="password" type="text" placeholder="请输入密码" v-model="password" />
			</view>
			<view @click="login()" class="button">
				<button @click="login()">登录</button>
			</view>
			
		</view>
		
	</view>
</template>

<script> 
	export default {
			data() {
				return {
					username:'',
					password:'',
					windowWidth:0,
					windowHeight:0,
				}
			},
			methods: {
				login: function(){
					let that=this;
					
					if(that.username == ''){
						uni.showToast({
							title: '请输入账户',
							icon: 'none',
							duration:1000
						});
						return false;
					}
					
					if(that.password == ''){
						uni.showToast({
							title: '请输入密码',
							icon: 'none',
							duration:1000
						});
						return false;
					}					
					if(that.username == 'admin' && that.password == '123'){
						uni.navigateTo({
							url: '../index/index',
							success: res => {},
							fail: () => {},
							complete: () => {} 
						});
					}
				}
			},
			onLoad() {
				let _this= this
				uni.getSystemInfo({
					success:function(res){
					_this.windowWidth = res.windowWidth;
					_this.windowHeight = res.windowHeight;
					
					console.log(res)
					console.log(res.windowHeight)
					console.log(res.screenHeight)
					return res.windowHeight;
					}
				});
			}
		}
	
</script>

<style lang="scss">
	.bg{
		background-color: rgba(104, 102, 204, 1);
		width: 100%;
		text-align: center;
		align-items: center;
		.content{
			padding-top: 250rpx;
		}
		.title{
			
			color: #FFFFFF;
			font-size: 58rpx;
			font-weight: bolder;
			
		}
		.input{
			margin-top: 148rpx;
		}
		input{
			width: 510rpx;
			height: 70rpx;
			margin: 40rpx auto;
			border-radius: 50rpx;
			color: #CCCCCC;
			background-color: #FFFFFF;
		}
		.button{
			display: flex;
			flex-direction: row;
			width: 510rpx;
			align-items: center;
			justify-content: center;
			margin:60rpx auto;
		}
		button{
			width: 510rpx;
			line-height: 70rpx;
			background-color:#8784f2;
			color: #FFFFFF;
			vertical-align: middle;
			margin: 0 10px;
			border-radius: 50rpx;
			align-items: center;
			justify-content: center;
		}
	}
</style>
